import React, { useEffect, useState } from 'react'
import { Row, Col, Space } from 'antd';
import './index.less'
import '@/assets/iconfont/iconfont.css'
import { findMore } from '@/api/content';

const FrontNav: React.FC<{
    condition: any
    navList: []
}> = (props) => {
    const htmlNav = props.navList.map((item, index) => {
        return (
            <li key={index} onClick={() => {
                props.condition({class: item.name});
                console.log(item.name);
                
            }}>
                <span className={`iconfont ${item.icon}`} />
                <p className='float-number'>{item.number}</p>
                <p className='class-name'>{item.name}</p>
            </li>
        )
    })

    console.log(props.condition);
    
    return (
        <div className='front-nav'>
            <ul>
                {htmlNav}
            </ul>
        </div>
    )
}

export default FrontNav;

